<template>
	<view class="u-p-20">
		<el-button @click="asyncFont">同步字体库</el-button>
		<view v-for="(item,index) in dataList1" :key="index">
			<view>
				<text>{{item.name}}</text>
				<text class="u-m-l-20">{{item.id}}</text>
			</view>
			<view v-if="item.bclazzs" v-for="(item2,index2) in item.bclazzs" :key="item2.id" class="u-p-l-20 u-flex">
				<view>
					<text>{{item2.name}}</text>
					<text class="u-m-l-20">{{item2.id}}</text>
				</view>
				<view class="u-m-l-20 u-flex">
					<view class="u-m-r-20 u-type-primary pointer"
						@click="getrealm(item2),dialogVisible = true,chooseItem1=item,chooseItem2=item2">获取子类</view>
					<view class="u-m-r-20 u-type-primary pointer" @click="asyncType2(item2)">同步子类</view>
				</view>
			</view>
		</view>

		<el-dialog title="子类以及海报列表" :visible.sync="dialogVisible" top="2%">
			<el-tag @click="chooseItem3={},getData3()" type="primary" class="u-m-r-20 pointer">全部</el-tag>
			<el-tag v-for="(item,index) in dataList2.tagList" :key="index" type="primary" @click="chooseItem3=item,getData3()"
				class="u-m-r-20 pointer">
				{{item.name}} {{item.id}}
			</el-tag>
			<el-button v-if="dataList2.tagList.length == 0 || chooseItem3.id" @click="asyncPosterAll(0)">全部同步</el-button>

			<el-table :data="dataList3" style="width: 100%;height: 500px;" size="mini" height="600px">
				<el-table-column type="index" width="50">
				</el-table-column>
				<el-table-column prop="thumbs" label="图片" width="180">
					<template slot-scope="scope">
						<el-image style="width: 20px; height: 20px" :src="scope.row.thumbnail"
							:preview-src-list="[scope.row.thumbnail]" />
					</template>
				</el-table-column>
				<el-table-column prop="isAsync" label="是否已同步" width="180">
					<template slot-scope="scope">
						<view v-if="scope.row.isAsync" class="u-type-success">已同步</view>
						<view v-else class="u-type-warning">未同步</view>
					</template>
				</el-table-column>
				<el-table-column prop="id" label="id">
				</el-table-column>
				<el-table-column fixed="right" label="操作" width="100">
					<template slot-scope="scope">
						<el-button type="text" size="small" @click="asyncData4(scope.row)">同步数据</el-button>
						<!-- <el-button v-if="scope.row.status == " @click="deleteThis(scope.row)" type="text" size="small">删除</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="params3.pageNum" :page-sizes="[20, 40, 60, 80,100,500,1000]" :page-size="params3.pageSize"
				layout="total, sizes, prev, pager, next, jumper" :total="params3.total">
			</el-pagination>
		</el-dialog>
	</view>
</template>

<script>
	let that
	let Authorization = "65d9e1a3-9d62-4f7a-8a58-f9ba64fcc8a8"
	export default {
		data() {
			return {
				dataList1: [],
				dataList2: {
					tagList: []
				},
				dataList3: [],
				chooseItem1: {},
				chooseItem2: {},
				chooseItem3: {},
				params3: {
					pageSize: 20,
					pageNum: 1,
					total: 0
				},
				dialogVisible: false,
			}
		},

		onLoad() {
			that = this
			that.getType1()
		},
		methods: {
			handleSizeChange(value) {
				that.params3.pageSize = value
				that.getData3()
			},
			handleCurrentChange(value) {
				that.params3.pageNum = value
				that.getData3()
			},


			async getType1() {
				let result = await that.$http.Get("home/type", {
					type: 1
				}, "加载中...")
				that.dataList1 = result.data
			},

			async getrealm(item) {
				let result = await that.$http.Get("realm", {
					id: item.id,
					tupe: 1,
				}, "加载中...")
				that.dataList2 = result.data
				that.getData3()
			},

			async getData3(item) {
				let thisParams = {
					rid: that.chooseItem2.id,
					typeId: that.chooseItem1.id,
					tagId: that.chooseItem3.id,
					pageSize: that.params3.pageSize,
					pageNum: that.params3.pageNum,
					type: 1
				}
				if (that.chooseItem3.id) thisParams.tagId = that.chooseItem3.id
				let result = await that.$http.Get("tag/templates", thisParams, "加载中...")

				let dataList3 = result.data.rows
				that.params3.total = result.data.total

				for (let item of dataList3) {
					item.isAsync = false
				}

				let nowIds = []
				for (let item of dataList3) {
					nowIds.push('' + item.id)
				}
				let result2 = await that.$http.Post("user/poster/posterList", {
					nowIds: nowIds
				}, "加载中...")

				if (result2.data.rows && result2.data.rows.length > 0) {
					for (let item1 of result2.data.rows) {
						let thisIdnex = dataList3.findIndex(item2 => item2.id == item1.id)
						if (thisIdnex != -1) dataList3[thisIdnex].isAsync = true
					}
				}
				that.dataList3 = dataList3
				that.$forceUpdate()
			},

			async asyncType1() {
				that.$http.Post("admin/poster/asyncPosterType", {
					dataList: that.dataList1
				}, "同步中...").then(res => {})
			},

			async asyncType2(item) {
				await that.getrealm(item)
				that.$http.Post("admin/poster/asyncPosterType2", {
					dataList: that.dataList2
				}, "同步中...").then(res => {})
			},

			asyncPosterAll(index) {
				if (index == that.dataList3.length) return that.common.showToast("同步成功")
				let item = that.dataList3[index]
				if (item.isAsync) return that.asyncPosterAll(index + 1)
				uni.request({
					url: "https://poster.miaogeban.com/poster/template/" + item.id,
					data: {},
					method: 'GET',
					header: {
						"content-type": "application/json",
						"Authorization": Authorization
					},
					timeout: 6000000000,
					success: (res) => {
						let data = res.data.data
						data.tagId = that.chooseItem3.id
						that.$http.Post("admin/poster/asyncPosterData3", {
							data: data
						}, "同步中...").then(res => {
							item.isAsync = true
							that.asyncPosterAll(index + 1)
						})
					},
				})
			},

			asyncData4(item) {
				if (that.dataList2.tagList && that.dataList2.tagList.length > 0) {
					if (!that.chooseItem3.id) return that.common.showToast("请选择标签")
				}
				uni.request({
					url: "https://poster.miaogeban.com/poster/template/" + item.id,
					data: {},
					method: 'GET',
					header: {
						"content-type": "application/json",
						"Authorization": Authorization
					},
					timeout: 6000000000,
					success: (res) => {
						let data = res.data.data
						data.tagId = that.chooseItem3.id
						that.$http.Post("admin/poster/asyncPosterData3", {
							data: data
						}, "同步中...").then(res => {
							item.isAsync = true
						})
					},
				})
			},


			asyncFont() {
				uni.request({
					url: "https://poster.miaogeban.com/poster/template/fontList",
					data: {},
					method: 'GET',
					header: {
						"content-type": "application/json",
						"Authorization": Authorization
					},
					timeout: 6000000000,
					success: (res) => {
						let data = res.data.data
						that.$http.Post("admin/poster/asyncPosterFont", {
							data: data
						}, "同步中...").then(res => {})
					}
				})
			},

		}
	}
</script>

<style>
	.el-table .warning-row {
		background: oldlace;
	}

	.el-table .success-row {
		background: #f0f9eb;
	}
</style>